<template>
  <div>
    <el-button style="float:left"   type="text" @click="dialogTableVisible = true"><el-badge :value=mes class="item">
  <el-button size="small">待处理的请求</el-button>
</el-badge></el-button>

    <el-dialog title="待处理的请求" :visible.sync="dialogTableVisible">
      <el-table :data="gridData">
        <el-table-column
          property="cheweiId"
          label="车位ID"
          width="150"
        ></el-table-column>
        <el-table-column
          property="user.uNickname"
          label="所属用户"
          width="200"></el-table-column>
        <el-table-column property="cheweiAddress" label="地址"></el-table-column>


        <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="com(scope.row)">通过</el-button>
        </template>
      </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="del(scope.row)">删除</el-button>
        </template>
      </el-table-column>


      </el-table>
    </el-dialog>














    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="cheweiId" label="车位ID" width="180">
      </el-table-column>

      <el-table-column prop="user.uNickname" label="所属用户" width="180">
      </el-table-column>

      <el-table-column prop="cheweiAddress" label="地址"> </el-table-column>

      <el-table-column label="租用状态" prop="cheweiState">
        <template slot-scope="scope">
          <p v-if="tableData[scope.$index].cheweiState == 1">未出租</p>
          <p v-if="tableData[scope.$index].cheweiState == 2">已出租</p>
        </template>
      </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="pull(scope.row)">下架</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  methods: {
    init() {
      this.$axios.post("/chewei/findAll").then((response) => {
        let r = response.data;
        console.log(r);
        this.tableData = r.data;
        console.log(r.data);

        this.$axios.post("/chewei/findAllWait").then((response) => {
        let r = response.data;
        this.gridData = r.data; });

        
        this.$axios.post("/chewei/count").then((response) => {
        let r = response.data;
        console.log(r);
        this.mes = r.data });
  });
    },

    pull(row) {
      console.log(row.cheweiId);

      let cheweiId = row.cheweiId;

      let config = {
        headers: {
          "Content-Type": "text/plain",
        },
      };
      this.$axios.post("/chewei/pull", cheweiId, config).then((response) => {
        console.log(response.data.code);
        if (response.data.code == 200) {
          this.$message({
            message: "恭喜你，下架成功",
            type: "success",
          });
        }
        this.init();
      });
    },

    com(row) {
      console.log(row.cheweiId);

      let cheweiId = row.cheweiId;

      let config = {
        headers: {
          "Content-Type": "text/plain",
        },
      };
      this.$axios.post("/chewei/com", cheweiId, config).then((response) => {
        console.log(response.data.code);
        if (response.data.code == 200) {
          this.$message({
            message: "审核通过",
            type: "success",
          });
        }
        this.init();
      });
    },

    del(row) {
      console.log(row.cheweiId);

      let cheweiId = row.cheweiId;

      let config = {
        headers: {
          "Content-Type": "text/plain",
        },
      };
      this.$axios.post("/chewei/del", cheweiId, config).then((response) => {
        console.log(response.data.code);
        if (response.data.code == 200) {
          this.$message({
            message: "删除成功",
            type: "success",
          });
        }
        this.init();
      });
    },

    
  },

  mounted() {
    this.$axios.post("/chewei/findAll").then((response) => {
      let r = response.data;
      this.tableData = r.data;
    }  );


     this.$axios.post("/chewei/findAllWait").then((response) => {
      let r = response.data;
      this.gridData = r.data;
    }  );

    this.$axios.post("/chewei/count").then((response) => {
        let r = response.data;
        console.log(r.data);
        this.mes = r.data });



  },
  data() {
    return {
      mes:"",
      gridData: [],
      tableData: [],
      dialogTableVisible: false,
    };
    
    
   
  }


};
</script>

<style>
</style>